<%--
  Created by IntelliJ IDEA.
  User: 0927
  Date: 2020/10/5
  Time: 6:29
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page isELIgnored="false" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>最近成交</title>
    <script src="${pageContext.request.contextPath}/js/jquery-3.4.1.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap-3.3.7-dist/css/bootstrap.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/sellCar.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/footer.css">
</head>

<style>
    .record-v{
        line-height: 140px;
        text-align: center;
        font-size: 24px;
        color: #495056;
    }
    .free{
        line-height: 16px;
        font-size: 16px;
        color: #8a8d96;
        text-align: center;
    }
    em{
        color: #22ac38;
        font-style: normal;
    }

    .img-p{
        width: 60px;
        height: 60px;
        margin: 30px auto 10px;
        background: url("${pageContext.request.contextPath}/images/xrb.png") no-repeat;
    }
    .user-info{
        margin-bottom: 24px;
        font-size: 18px;
        color: #495056;
        text-align: center;
    }
    .user-info span{
        display: block;
        font-size: 14px;
        color: #a5abb2;
        text-align: center;
    }
    .body{
        background-color: #f8f8f8;
    }
    .person{
        background-color: #fff;
        border: 1px solid #dcdcdc;
    }
    .pricedown{
        height: 18px;
        margin-right: 9px;
        padding-right: 2px;
        line-height: 18px;
        color: #ff7e00;
        border: 1px solid #ff7e00;
    }
    .through{
        font-size: 14px;
        color: #999;
        text-decoration: line-through;
        text-decoration-line: line-through;
        text-decoration-style: solid;
        text-decoration-color: currentcolor;
        text-decoration-thickness: auto;
    }
    .mile{
        font-size: 12px;
        color: #999;
    }
</style>

<body>
<!--footer-->
<div id="nav_my">

</div>



<!--服务 end-->

<!--question begin-->
<div class="container-fluid">
    <div class="row record-v" style="height: 140px">以下为最近成交的车源记录</div>

    <!--        缩略图-->
    <div class="row person bargain">
        <c:forEach var="x" items="${newRecentList}" begin="0" end="12">
            <div class="col-md-3">
                <div class="thumbnail">
                    <img src="${pageContext.request.contextPath}/images/car1.png"
                         alt="" style="width: 80%;">
                    <div class="caption car_info ">
                        <p style="font-size: 16px">${x.brName}${x.stName} ${x.cPaifang}L ${x.cDrive}
                        </p>
                        <span class="mile">${x.cRegistration}年 | ${x.cMileage}万公里 | 到店服务</span>
                        <p style="margin-top: 5px">成交价 <span style="color: #f76367;font-size: 18px">${x.rePrice}万</span>&nbsp;&nbsp;<strong>2天卖出</strong></p>
                    </div>
                </div>
            </div>
        </c:forEach>
    </div>
    <!--        缩略图-->

    <br>
<%--    搜索框--%>
    <div class="row" style="height: 60px">

        <div class="input-group input-group-lg col-md-4" style="margin: 0 auto;">
            <!-- <div class="input-group input-group-sm"> -->
            <input type="text" class="phone" value="" name="buycar" id="buycar" placeholder="请输入手机号码，200万名车主已经提交">
            <span class="input-group-btn">
                <button class="btn btn-default btn-primary" data-toggle="modal" type="button" onclick="show_modal();" id="sell">免费卖车</button>
            </span>
            <!-- 模态框（Modal） -->
            <div class="modal fade" id="myModals" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4 class="modal-title" id="myModalLabel">精翼卖车</h4>
                        </div>
                        <div class="modal-body">
                            <form class="form-horizontal" role="form">
                                <div class="form-group">
                                    <label for="brNames" class="col-md-4 control-label">所属品牌</label>
                                    <div class="col-md-6">
                                        <input type="text" class="form-control" id="brNames" placeholder="请输入品牌">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="stNames" class="col-md-4 control-label">所属车系</label>
                                    <div class="col-md-6">
                                        <input type="text" class="form-control" id="stNames" placeholder="请输入所属车系">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="carRegistration" class="col-md-4 control-label">上牌时间</label>
                                    <div class="col-md-6">
                                        <input type="date" class="form-control" id="carRegistration" placeholder="请输入所属车系">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="carMileage" class="col-md-4 control-label">行驶里程</label>
                                    <div class="col-md-6">
                                        <input type="text" class="form-control" id="carMileage" placeholder="请输入所属车系">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="carDesc" class="col-md-4">文本框</label>
                                    <div class="col-md-6">
                                        <textarea class="form-control" rows="3" id="carDesc"></textarea>
                                    </div>
                                </div>
                            </form>

                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                            <button type="button" class="btn btn-primary" onclick="register()">提交更改</button>
                        </div>
                    </div><!-- /.modal-content -->
                </div><!-- /.modal -->
            </div>
    </div>
    </div>
    <p class="free">免费咨询：<em>400-069-6540</em></p>
    <br>

    <div class="row question">
        <h2>精翼问答</h2>
        <div class="left">
            <h3>Q1：卖车流程是怎样的？</h3>
            <p>1、在本页填写卖车信息或拨打400-023-1529联系我们。<br/>
                2、由检测师进行车辆信息收集，并经过瓜子评估，给出瓜子价参考，由车主确定发布报价。<br/>
                3、达成交易合同，支付车款并过户。
            </p>
            <br>

            <h3>Q2:通过精翼网站出售车辆需要什么费用？</h3>
            <p>精翼网站上门验车不收取费用，免费评估，并为您免费提供车辆检测报告，整个服务过程全部免费。</p>
            <br>
            <h3>Q3:大概多长时间能够成交？</h3>
            <p>根据我们的经验，大部分车辆平均7日可以成交。但车辆的出售时间受市场情况、车况等多因素影响。</p>
        </div>
        <div class="right">
            <h3>Q4：卖车需要准备什么？</h3>
            <p>
                1、身份证；<br>
                2、环保标；<br>
                3、购置税本；<br>
                4、行驶证；<br>
                5、检字标；<br>
                6、购置税发票；<br>
                7、车辆登记证；<br>
                8、交强险标；<br>
                9、购车发票/最近一次过户发票；<br>
                10、交强险单。
            </p>
        </div>
    </div>
</div>
<!--footer-->
<div id="footer">

</div>
<!--footer-->
<!--question end-->
<script src="${pageContext.request.contextPath}/js/jquery-3.4.1.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<script>
    function register(){
        //一个控件一个控件进行获取了
        let brName = $("#brNames").val();
        let stName = $("#stNames").val();
        let carRegistration = $("#carRegistration").val();
        let carMileage = $("#carMileage").val();
        let carDesc = $("#carDesc").val();
        let call = $("#buycar").val();
        let datas = {"brName":brName,"stName":stName,"carRegistration":carRegistration,"carMileage":carMileage,"carDesc":carDesc,"call":call};
        //发送key-value
        $.post('/prj/carSales/sales.action',datas,function(data){
            success:function aa(data) {
                if (data.code="200"){
                    alert("预约卖车成功")
                }
            }
        });
    }

    function show_modal() {
        let phone = $("#buycar").val();

        if(!(/^1[3456789]\d{9}$/.test(phone))){
            alert("手机号码有误，请重填");
            return;
        }else {
            $('#myModals').modal('show');
        }

    }

    $(function(){
        $("#nav_my").load("${pageContext.request.contextPath}/jsp/common/nav.jsp");
    })

    $(function(){
        $("#footer").load("${pageContext.request.contextPath}/jsp/common/footer.jsp");
    })
</script>
</body>
</html>
